import {
  createApp,
  reactive,
  computed,
} from "../node_modules/vue/dist/vue.esm-browser.js";

const data = [
  { text: "看书", completed: false },
  { text: "健身", completed: false },
  { text: "学习", completed: true },
];

createApp({
  setup() {
    const todos = reactive(data);
    const activeCount = computed(() => {
      return todos.filter((item) => !item.completed).length;
    });
    return {
      activeCount,
      push: () => {
        todos.push({
          text: "上班",
          completed: false,
        });
      },
    };
  },
}).mount("#app");
